<template>
    <n-divider title-placement="left">采用的设备:</n-divider>
    <n-radio-group v-model:value="value" name="radiogroup" @change="changeValue">
        <div v-if="equipmentsGM2.length !== 0">
            二级密码模块：
            <n-radio v-for="equipment in equipmentsGM2" :key="equipment.label" :value="equipment.value">
                {{ equipment.label }}
            </n-radio>
            <n-divider dashed />
        </div>
        <div v-if="equipmentsGM1.length !== 0">
            一级密码模块：
            <n-radio v-for="equipment in equipmentsGM1" :key="equipment.label" :value="equipment.value">
                {{ equipment.label }}
            </n-radio>
            <n-divider dashed />
        </div>
        <div v-if="equipmentsHJ.length !== 0">
            缓解措施：
            <n-radio v-for="equipment in equipmentsHJ" :key="equipment.label" :value="equipment.value">
                {{ equipment.label }}
            </n-radio>
            <n-divider dashed />
        </div>
        <div>
            非安全设备：
            <n-radio v-for="equipment in equipmentsGW" :key="equipment.label" :value="equipment.value">
                {{ equipment.label }}
            </n-radio>
            <n-radio value="0">无</n-radio>
        </div>
    </n-radio-group>
</template>

<script lang="ts" setup>
import { ref, onMounted } from 'vue'
import { NRadio, NRadioGroup, NDivider } from 'naive-ui'
import type { RadioProps } from 'naive-ui'
import requset from "@/utils/requset"
import type { response } from "@/utils/requset"
import type { equipmentResopne } from "@/utils/interfaces/respone"

const props = defineProps<{
    pointId: number,
    value: number,
}>()

const emitFn = defineEmits(['changeVaule'])

function changeValue() {
    emitFn('changeVaule', value.value)
}

const value = ref<number>()

const equipmentsGM2 = ref<RadioProps[]>([])
const equipmentsGM1 = ref<RadioProps[]>([])
const equipmentsHJ = ref<RadioProps[]>([])
const equipmentsGW = ref<RadioProps[]>([])

function getData() {
    requset.get('/project/getEquipmentByPointId', {
        pointId: props.pointId,
    }).then((res: response<equipmentResopne[]>) => {
        if (res.status !== 200) {
            return;
        }
        let data = res.data.data;
        for (let equipment of data) {
            let equipmentRadio: RadioProps = {
                label: equipment.name,
                value: equipment.id
            }
            switch (equipment.type) {
                case 0:
                    equipmentsGW.value.push(equipmentRadio)
                    break;
                case 1:
                    equipmentsHJ.value.push(equipmentRadio)
                    break;
                case 2:
                    equipmentsGM1.value.push(equipmentRadio)
                    break;
                case 3:
                    equipmentsGM2.value.push(equipmentRadio)
                    break;
            }
        }
    })
}


onMounted(() => {
    // console.log(props)
    getData()
})
</script>

<style></style>